No' Access-Control-Allow-Origin' header存在于由CloudStorageTools :: createUploadUrl创建的URL上

时间:2016-02-05 12:15:44

标签: php google-app-engine google-cloud-storage

我发送了一个Ajax请求,将个人资料照片上传到我的Google App Engine实例

根据https://cloud.google.com/appengine/docs/php/googlestorage/user_upload#createuploadurl_options

我需要创建一个我需要发送图片的网址。

$('.image-form').change(function() {
  var data = new FormData();
  data.append('uploaded_files', $('.image-form').prop('files')[0]);
  $.ajax({
    type: "GET",
    url: "https://example.appspot.com/v1/upload/url",
    success: function(response){
        var url = response.url;
        $.ajax({
          type: "POST",
          url: url,
          processData: false,
          contentType: false,
          data: data,
          success: function(response){
              console.log(response);
          }
        });
    }
  });

我收到错误

否'访问控制 - 允许 - 来源'标头出现在请求的资源上。 Origin' local.app'因此不允许访问。响应的HTTP状态代码为503。

我已在此处给出了云存储上的CORS https://cloud.google.com/storage/docs/cross-origin#Configuring-CORS-on-a-Bucket

任何形式的帮助都将得到真正的赞赏。

1 个答案:

答案 0 :(得分:0)

以下是我的Kuoll remote debugger针对网络应用的java (抱歉)代码段。

package com.kuoll.server.filters;

import javax.servlet.*;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class CrossOriginFilter implements Filter {

    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse resp = (HttpServletResponse) response;

        resp.addHeader("Access-Control-Allow-Origin", "*");
        resp.setHeader("Access-Control-Allow-Methods", "POST, OPTIONS");
        resp.setHeader("Access-Control-Allow-Headers", "origin, content-type, accept");

        chain.doFilter(request, response);
    }

    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
    }

    @Override
    public void destroy() {
    }

}

*中的resp.addHeader("Access-Control-Allow-Origin", "*");替换为您的Origin(如果需要)。

的web.xml

<filter-mapping>
    <filter-name>CrossOriginFilter</filter-name>
    <url-pattern>/api/*</url-pattern>
</filter-mapping>