相关疑难解决方法(0)

ES6 模块的问题

已解决:修复我的服务器的 MIME 类型解决了该问题。我忘了前段时间我自己惹了他们。特别感谢@Sidney@estus@Josh Lee帮助我。


一旦我发现一个ES6 模块的 MDN 上引用的实时演示仅适用于我当前版本的 Chrome,我想尝试使用模块进行试验。可悲的是,我无法获得任何与执行相关的模块,即使现场演示工作正常。我什至将这两个文件(index.htmlutils.js)复制到我服务器上的一个目录中,试图准确地重新创建实时演示,但即使是一行代码,它仍然无法运行。我错过了什么?有人可以给我一些关于何时执行模块脚本以及为什么我的不执行的提示吗?

tl; dr:我找到了一个 ES6 模块的工作示例,但尝试在我自己的本地服务器上重新创建它不起作用。

[编辑:]是的,控制台设置为“全部隐藏”。两个站点都显示缺少 favicon.ico 的错误,所以它与我的问题无关。

[编辑:] MDN 引用的文章,包含现场演示。

[更新:]问题似乎出在我的本地服务器在获取模块时给出的不正确的 MIME 类型。


index.html/test.htm:

<!DOCTYPE html>
<meta name="viewport" content="width=device-width, minimum-scale=1.0">
<script type="module">
  import {addTextToBody} from './utils.js';

  addTextToBody('Modules are pretty cool.');
</script>
Run Code Online (Sandbox Code Playgroud)

实用程序.js:

export function addTextToBody(text) {
  const div = document.createElement('div');
  div.textContent = text;
  document.body.appendChild(div);
}
Run Code Online (Sandbox Code Playgroud)

矿: 矿

现场演示: 在此处输入图片说明

javascript google-chrome module ecmascript-6

7
推荐指数
1
解决办法
3万
查看次数

适用于file:///的Google Maps API密钥引荐来源

我有一个应用程序的情况,我部署了一个可以在三个不同位置显示的Google Map:

  • 在应用程序Webview中
  • 在浏览器中预览
  • 发布到服务器

因此,我需要用户在api密钥中添加一些引用来覆盖它们发布到自己的服务器的时间.

他们可以为自己服务器上发布的地图和浏览器本地方面的预览添加一个推荐者.

但是,当在应用程序Web视图中预览地图时,我无法弄清楚您作为引用者添加的内容,此时页面的URL是文件:///引用的URL?

如果我们将所有引用者留空以获得完整的通配符API密钥,则可以在应用程序的webview中使用.

我已经尝试了尽可能多的配置,因为我可以想到一个引用文件:/// url但没有运气:

我试过了:

文件

文件*

文件/*

文件:///*

google-maps google-maps-api-3

6
推荐指数
1
解决办法
2394
查看次数

未捕获的安全错误:无法在“历史记录”上执行“replaceState”:带有 URL 的历史状态对象

我使用 webpack (1.12.2)、react (0.14.2)、react-router (1.0.0-rc4) 和History (1.13.0) 库。

当我使用 webpack 构建项目时,在 google chrome 控制台中出现错误:

Uncaught SecurityError: Failed to execute 'replaceState' on 'History': A history state object with URL 'file:///Users/and/devel/Wond/index.html' cannot be created in a document with origin 'null'.
Run Code Online (Sandbox Code Playgroud)

createBrowserHistory.js第 41 行。

在我的源代码(index.jsx)中,我使用 createBrowserHistory:

var createBrowserHistory = require('history/lib/createBrowserHistory');
let history = createBrowserHistory();

ReactDOM.render(<Router routes={routes} history={history} />, document.getElementById('content'));
Run Code Online (Sandbox Code Playgroud)

javascript reactjs webpack react-router

1
推荐指数
1
解决办法
6822
查看次数

根据API的结果嵌入YouTube视频

我正在尝试使用YouTube API将YouTube视频嵌入到网页中.到目前为止,我已经能够使用API​​根据搜索条件"dog"收集结果.我将如何获取这些结果并将其转换为嵌入式视频.现在我将结果显示为index.html页面上的JSON文件.此外,这只适用于我的HTML和JavaScript文件托管在服务器上,有没有办法在本地执行此操作?

非常感谢您的帮助,并提前感谢您.

HTML:

<html>
    <head>
        <script src="javascript.js" type="text/javascript"></script>
        <script src="https://apis.google.com/js/client.js?onload=onClientLoad" type="text/javascript"></script>
    </head>
    <body>
        <pre id="response"></pre>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

JavaScript的:

function showResponse(response) {
    var responseString = JSON.stringify(response, '', 2);
    document.getElementById('response').innerHTML += responseString;
}

function onClientLoad() {
    gapi.client.load('youtube', 'v3', onYouTubeApiLoad);
}

function onYouTubeApiLoad() {
    gapi.client.setApiKey('API_KEY');

    search();
}

function search() {
    var request = gapi.client.youtube.search.list({
        part: 'snippet',
        q:"dogs",

    });


    request.execute(onSearchResponse);
}

function onSearchResponse(response) {
    showResponse(response);
}
Run Code Online (Sandbox Code Playgroud)

html javascript api video youtube-api

1
推荐指数
1
解决办法
1013
查看次数