ThingWorx 跨域问题has been blocked by CORS policy: No ‘Access-Control-Allow-Origin‘ header is present...

最新推荐文章于 2025-03-26 10:54:03 发布

hongyu#ding

最新推荐文章于 2025-03-26 10:54:03 发布

阅读量2.1k

点赞数

分类专栏：好记性不如记事本文章标签： ThingWorx 跨域 ThingWorx API web.xml tomcat

本文链接：https://blog.youkuaiyun.com/dinghongyu520/article/details/121286671

版权

好记性不如记事本专栏收录该内容

43 篇文章

订阅专栏

本文介绍了如何解决在访问部署在公司服务器上的ThingWorxPlatform时遇到的跨域问题。通过编辑thingworx安装目录下的Apache Tomcat的web.xml文件，添加CORS过滤器并配置相关参数，以及对OPTIONS请求的处理，可以实现跨域访问。最后提供了一个简单的测试HTML页面来验证接口调用是否成功。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本文介绍ThingWorx Platform平台接口如何访问，出现跨域问题如何解决。参考官方文章CS229450 - How to Enable Cross-Origin Resource Sharing (CORS) in Apache Tomcat for ThingWorx Platform/ThingWorx Navigate

背景

公司服务器部署了一台 ThingWorx Platform，现在另一个系统要调用thingworx中开放的api接口（thingworx如何写api接口可参考官网），访问时浏览器提示错误：

很明显是跨域问题，解决方案见下面步骤：

解决方案

1、找到thingworx安装目录下的tomcat下web.xml文件：<Apache Tomcat Install>\webapps\Thingworx\WEB-INF\ ，在 </session-config> 行后面新增

<filter>
	<filter-name>CorsFilter</filter-name>
    <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
    <init-param>
		<param-name>cors.allowed.origins</param-name>
		<param-value>*</param-value> 
    </init-param>
    <init-param>
        <param-name>cors.allowed.methods</param-name>
        <param-value>OPTIONS,GET,POST,HEAD,PUT,DELETE</param-value>
    </init-param>
	<init-param>
		<param-name>cors.allowed.headers</param-name>
		<param-value>Authorization,appKey,x-thingworx-session,Content-Type,X-Requested-With,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
	</init-param>
	<init-param>
		<param-name>cors.exposed.headers</param-name>
		<param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
	</init-param>
	<init-param>
		<param-name>cors.support.credentials</param-name>
		<param-value>false</param-value>
	</init-param>
	<init-param>
		<param-name>cors.preflight.maxage</param-name>
		<param-value>10</param-value>
	</init-param>
	<init-param>
		<param-name>cors.request.decorate</param-name>
		<param-value>true</param-value>
	</init-param>
</filter>

<filter-mapping>
		<filter-name>CorsFilter</filter-name>
		<url-pattern>/*</url-pattern>
</filter-mapping>

cors.allowed.origins的值可以设置为指定域访问，如有多个用英文逗号分隔，允许所有域访问设置为*，这里直接设置为*。

2、ThingWorx Platform 8.5 及更高版本开始，还需要注释掉以下与OPTIONS相关的块：

  <!-- <security-constraint>
    <web-resource-collection>
      <web-resource-name>Forbidden</web-resource-name>
      <url-pattern>/*</url-pattern>
      <http-method>HEAD</http-method>
      <http-method>OPTIONS</http-method>
    </web-resource-collection>
    <auth-constraint/>
  </security-constraint> -->

3、保存web.xml文件，重启Apache Tomcat。

完成以上步骤，thingworx已经放开了跨域限制，只需要调用即可，可以测试下，测试html如下

<html>
  <head>
  <meta charset="utf-8"/>
	<script>
		function httpFunction()
		{
			const theUrl = "thingworx API地址";
			var xmlHttp = new XMLHttpRequest();
			xmlHttp.open( "POST", theUrl, false ); // false for synchronous request
			xmlHttp.setRequestHeader("Content-type", "application/json");
			xmlHttp.setRequestHeader("Accept","application/json");
            xmlHttp.setRequestHeader("appKey","thingworx上面申请的key");
			xmlHttp.send();
			alert(xmlHttp.responseText)
			return xmlHttp.responseText;
		}
	</script>
	<script>
	function myFunction() {
	  alert("Click me Test!");
	}
	</script>

  </head>
  <body>
	  <button onclick="httpFunction()">Click me</button> 
	  <button onclick="myFunction()">Click me Test</button> 
  </body>
</html>