时间戳

首页 > 解决方案 > Jquery ajax 调用返回 URL 并加载到框架或 div

javascript - Jquery ajax 调用返回 URL 并加载到框架或 div

问题描述

我有一个客户端 web 应用程序，它都是静态的 html 和 javascript，我使用 JQuery。我更像是 Spring 的后端/中间件人，所以我不太擅长前端的东西。

我有一个从客户端 UI 到用 Spring 作为控制器编写的中间件 Web 应用程序的 RESTful API。我可以成功调用它，并且有中间件业务逻辑，我可以在其中使用第三方 API 并返回 HTML。我将此 HTML 返回给我的客户端，并尝试将其加载到 iframe 或 div 标记中。当然，我遇到了各种 javascript 错误和很多 CORS 问题。因此，如果这不是从另一个网站获取 HTML 并将其部署到我的页面上的可行选项，那么我愿意放弃它。

我在我的后端创建了另一个 RESTful API，现在它只返回这个第三方 RESTful API 的 URL。具体来说，我正在调用 Coinbase 的授权页面，但它很容易成为任何其他第三方授权页面。我有他们推荐的完整 URL，我准备用它做点什么。

所以，我得到一个这样的 URL（dataType 是'text'），我可以看到它并发出警报：

https://www.coinbase.com/oauth/authorize?
  response_type=code&client_id=MY_CLIENT_ID
  &redirect_uri=MY_REDIRECT_URL
  &state=SECURE_RANDOM
  &scope=wallet:accounts:read

我想我会做如下重定向： 

window.location.replace(response);

但是，会发生什么是我得到一个 HTTP 404，因为我的系统正在将我的 UI 本地主机预先挂在该 URL 上。所以，它看起来像：

http://localhost:8080/my_web_ui_app/https://www.coinbase.com/oauth/authorize?
  response_type=code&client_id=MY_CLIENT_ID
  &redirect_uri=MY_REDIRECT_URL
  &state=SECURE_RANDOM
  &scope=wallet:accounts:read

显然，这不会起作用，因为我收到了 HTTP 404 错误。

还有什么我应该尝试的吗？就像我说的，我不是一个好的 UI 人，但我只需要一些可以正常工作的东西。

谢谢！

标签： javascriptjquerycoinbase-api

解决方案

这是 Ajax 调用本身。

$.ajax({
        url : 'http://localhost:8080/myapp-be/api/myrestapi/authorize',
        headers : {'token' : token},
        dataType: 'text',
        cache: false,
           success: function(response) {
               console.log(response)
               $(location).attr('href',response);
           }
    });

dataType: 'text' 是罪魁祸首。

URL 是响应，作为“文本”，它在响应周围添加了另一层引号。

一旦我从 Ajax 调用中删除了 dataType，那么默认的 dataType 就起作用了，我不再得到带有额外引号的 URL。成功后，我可以做一个简单的重定向，而且效果很好。是一个简单的修复。

谢天谢地 Chrome 和调试工具，所以我可以看到返回的响应有额外的引号。

推荐阅读