javascript - 在某些情况下没有 'Access-Control-Allow-Origin' header 错误，但在其他情况下则没有

Question

我知道已经有很多人对此有疑问。我看了其中的大多数。服务器必须返回带有上述 header 的响应，允许我的源对其执行请求。

但是，有一点我不明白。我正在创建一个简单的 Stash 插件，在单击按钮时执行发布请求。

我有这个错误。好的。但为什么 post 请求有效呢？该帖子是启动构建，构建已启动。我仍然有错误，所以在客户端，我显示一条消息，指出构建尚未启动...

更奇怪的是，我有一个同事做了一个简单的 Chrome 扩展，做了同样的事情，但错误没有显示在浏览器控制台中......

我想了解为什么我的失败而他的成功。

我的 Stash 插件 JavaScript 代码:

require(['jquery', 'stash/api/util/state'], function ($, pageState) {
var url = "https://build.company.org:8443/trigger";
var commit = pageState.getCommit();
var repo = pageState.getRepository()

$.post(
    url,
    {
        'code': '9b73fccb6c839d',
        'workflow.repourl': 'ssh://git@stash.company.org:7999/' + repo.project.key + "/" + repo.name,
        'workflow.reponame': repo.project.key + "/" + repo.name,
        'workflow.revision': commit.id,
        'workflow.user': commit.author.name,
        'workflow.message': commit.message
    },
    function (data) {
        AJS.messages.success("#launch-build-message", {
          fadeout: true,
          delay: 5000,
          title: "Success!",
          body: "The build was<br>successfully launched!"
        });
    }
).fail(function () {
    AJS.messages.error("#launch-build-message", {
        fadeout: true,
        delay: 5000,
        title: "Error!",
        body: "The build could not<br>be launched!"
    });
});
});

他的 Chrome 扩展 javascript:

var build_status_div = $('div.build-status-summary');

var rebuild_div = $('<div class="plugin-item"></div>').insertAfter(build_status_div);
var rebuild_a = rebuild_div.append('<a href=""><span class="aui-icon aui-icon-small aui-iconfont-build" title="Launch another build"></span><span class="label">Launch another build</span></a>');
var success_div = $('<div class="plugin-item build-result build-success"><span>Build started !</span></div>').insertAfter(rebuild_div);
var failure_div = $('<div class="plugin-item build-result build-failure"><span>Could not start the build.</span></div>').insertAfter(success_div);
success_div.hide();
failure_div.hide();

rebuild_a.click(function(ev) {
ev.preventDefault();

$.post(
    'https://build.company.org:8443/trigger',
    {
        'code': '9b73fccb6c839d',
        'property:workflow.repourl': 'ssh://git@stash.company.org:7999/Project_1/Rep_1,
        'property:workflow.reponame': 'Project_1/Rep_1,
        'property:workflow.revision': 'dbc5de00a675996df25cebb6c3cce7fad39247b9',
        'workflow.user': 'Some User',
        'workflow.message': 'test'
    },
    function (data) {
        success_div.fadeIn().delay(5000).fadeOut();
    }
).fail(function () {
    failure_div.fadeIn().delay(5000).fadeOut();
});
});

Answer 1

I have a colleague that did a simple Chrome extension

Chrome 扩展程序是显式安装到浏览器中的软件。他们被授予从其他网站读取数据的权限。

您访问的任意页面上的 JavaScript 都会受到更有限的访问。如果您想使用 XMLHttpRequest 访问另一个源，该源必须使用 CORS 来授予您的站点权限。