如何通过 Bjron Holines Store Locator 插件使用 javascript + 系统现有的 ColdFusion 代码为多个域设置 cookie
How can I set a cookie for multiple domains using javascript + already on the system existing ColdFusion code, via Bjron Holines Store Locator plugin
为了展示商店定位器,我正在使用 Bjorn Holines 商店定位器插件。这个插件有一个 html 模板,它在所有商店的地图之外创建一个列表,其中包含详细信息。我在这个模板中添加了一个按钮。目标是在单击此按钮时存储具有特定分支 ID 的 cookie。此 cookie 应在多个域(无子域)上设置。我创建了一个调用 cfc 的函数。此 cfc 调用一个已经存在的自定义标记,其中通过使用 img scr="..." 设置 cookie。
请注意,我对 ajax/json 没有任何经验或知识。我看到很多障碍; returnformat, returntypes, cfoutputs, img, cfsavecontent, return value calling the custom tag 等。使用这段代码我得到了一个成功的结果+ javascript警报,但显然没有存储 cookie。我如何使用这个已经存在的自定义标签来设置 cookie?有可能吗?
hmtl模板中的按钮+功能:
<button type="button" class="btn btn-sm" id="voorkeur" onClick="setCookie('{{branch}}','{{name}}')">Als voorkeur instellen</button>
<script>
function setCookie(branch, name) {
$.ajax({
url: "siteparts/branch/setCookieMultipleDomains.cfc"
, type: "POST"
, dataType: "json"
, data: {"method" : "setCookie", "returnFormat": "json", "branch": branch}
}).done(function(response) {
console.log("response", response);
alert('Uw voorkeur voor ' + name + ' is opgeslagen.');
}).fail(function(jqXHR, textStatus, errorMessage) {
console.log("errorMessage",errorMessage);
});
}
</script>
cfc setCookieMultipleDomains.cfc:
<cfcomponent>
<cffunction name="setCookie" returntype="struct" access="remote">
<cfargument name="branch" type="string" required="true">
<cfset lresponse = {success=true}>
<cftry>
<CF_CU_cookieding action="setCookies" branch="#branch#" ret="qGetCookies"> --->
<cfcatch>
<cfset lresponse = {success=false}>
</cfcatch>
</cftry>
<cfreturn lresponse>
</cffunction>
</cfcomponent>
自定义标签CF_CU_cookieding.cfm:
<cfsetting enablecfoutputonly="yes">
<cfparam name="attributes.action" default="">
<cfparam name="attributes.branch" default="">
<cfparam name="attributes.ret" default="">
<cfif attributes.action eq "setCookies">
<cfsavecontent variable="thecontent">
<cfoutput><img src="https://www.domain1.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
<cfoutput><img src="https://www.domain2.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
<cfoutput><img src="https://www.domain3.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
<cfoutput><img src="https://www.domain4.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
</cfsavecontent>
<cfif attributes.ret neq "">
<cfset setvariable("caller.#attributes.ret#", thecontent)>
<cfelse>
<cfoutput>#thecontent#</cfoutput>
</cfif>
<cfelseif attributes.action eq "createCookie">
<cfcookie name="d_cookie_ok" value="1" expires="never">
<cfif attributes.branch neq "">
<cfcookie name="d_cookie_branch" value="#attributes.branch#" expires="never">
</cfif>
</cfif>
和 img scr setCookie.cfm :
<cfparam name="request.branch" default="">
<cfif request.branch neq "">
<CF_CU_cookieding action="createCookie" branch="#request.branch#">
<cfelse>
<CF_CU_cookieding action="createCookie">
</cfif>
您不能在不同的域中设置 cookie,如果您具有 DNS 访问权限,则可以通过使用子域设置来解决这个问题。
example.com
这个.example.com
已使用自定义标签的返回值 qGetCookies 修复cu_cookieding。在我的 cfc 中,我将返回类型更改为 "any"。
我从不必要的文本中删除了 qGetCookies,只有 img 的路径,逗号分隔。发回响应。
在 html 模板的 javascript 中,我为未来的 img 添加了一个 div。我根据 cfc 响应创建了一个数组。
遍历数组以创建图像。现在为多个域设置了 cookie
cfc :
<cfcomponent>
<cffunction name="setCookie" returntype="any" access="remote">
<cfargument name="branch" type="string" required="true">
<cftry>
<CF_CU_cookieding action="setCookies" branch="#branch#" ret="qGetCookies">
<cfcatch>
<cfset lresponse = {success=false}>
</cfcatch>
</cftry>
<cfset lresponse = replace(qGetCookies,'><','>,<','all')>
<cfset lresponse = replace(lresponse, '<img src="','','all')>
<cfset lresponse = replace(lresponse,'" width="1" height="1">','','all')>
<cfreturn lresponse>
</cffunction>
</cfcomponent>
html 模板:
{{#location}}
<li data-markerid="{{markerid}}">
<div class="list-label"><img src="{{marker}}" /></div>
<div class="list-details">
<div class="list-content">
<div class="loc-name">{{name}}</div>
<div class="loc-addr">{{address}}</div>
{{#if address2}}
<div class="loc-addr2">{{address2}}</div>
{{/if}}
<div class="loc-addr3">{{postal}} {{city}}</div>
{{#if web}}
<div class="loc-web"><a href="http://{{web}}" target="_blank">{{niceURL web}}</a></div>
{{/if}}
{{#if distance}}
<div class="loc-dist loc-default-dist">{{distance}} {{length}}</div>
{{#if altdistance}}<div class="loc-dist loc-alt-dist">{{altdistance}} {{altlength}}</div>
{{/if}}
{{/if}}
<div class="loc-directions"><a href="https://maps.google.com/maps?saddr={{origin}}&daddr={{address}} {{address2}} {{city}}, {{state}} {{postal}}" target="_blank">Route</a></div>
<div id="cImgHolder"></div>
<button type="button" class="btn btn-sm" id="voorkeur" onClick="setCookie('{{branch}}','{{name}}')">Als voorkeur instellen</button>
<script>
function setCookie(branch, name) {
$.ajax({
url: "decokay2015/siteparts/branch/setCookieMultipleDomains.cfc"
, type: "POST"
, dataType: "json"
, data: {"method" : "setCookie", "returnFormat": "json", "branch": branch}
}).done(function(response) {
console.log("response", response);
var cArr = response.split(',');
console.log("cArr", cArr);
for (var i = 0; i < cArr.length; i++) {
var elem = document.createElement("img");
elem.setAttribute("src", cArr[i]);
elem.setAttribute("height", "1");
elem.setAttribute("width", "1");
document.getElementById("cImgHolder").appendChild(elem);
}
alert('Uw voorkeur voor ' + name + ' is opgeslagen.');
}).fail(function(jqXHR, textStatus, errorMessage) {
console.log("errorMessage",errorMessage);
});
}
</script>
</div>
</div>
</li>
{{/location}}
为了展示商店定位器,我正在使用 Bjorn Holines 商店定位器插件。这个插件有一个 html 模板,它在所有商店的地图之外创建一个列表,其中包含详细信息。我在这个模板中添加了一个按钮。目标是在单击此按钮时存储具有特定分支 ID 的 cookie。此 cookie 应在多个域(无子域)上设置。我创建了一个调用 cfc 的函数。此 cfc 调用一个已经存在的自定义标记,其中通过使用 img scr="..." 设置 cookie。 请注意,我对 ajax/json 没有任何经验或知识。我看到很多障碍; returnformat, returntypes, cfoutputs, img, cfsavecontent, return value calling the custom tag 等。使用这段代码我得到了一个成功的结果+ javascript警报,但显然没有存储 cookie。我如何使用这个已经存在的自定义标签来设置 cookie?有可能吗?
hmtl模板中的按钮+功能:
<button type="button" class="btn btn-sm" id="voorkeur" onClick="setCookie('{{branch}}','{{name}}')">Als voorkeur instellen</button>
<script>
function setCookie(branch, name) {
$.ajax({
url: "siteparts/branch/setCookieMultipleDomains.cfc"
, type: "POST"
, dataType: "json"
, data: {"method" : "setCookie", "returnFormat": "json", "branch": branch}
}).done(function(response) {
console.log("response", response);
alert('Uw voorkeur voor ' + name + ' is opgeslagen.');
}).fail(function(jqXHR, textStatus, errorMessage) {
console.log("errorMessage",errorMessage);
});
}
</script>
cfc setCookieMultipleDomains.cfc:
<cfcomponent>
<cffunction name="setCookie" returntype="struct" access="remote">
<cfargument name="branch" type="string" required="true">
<cfset lresponse = {success=true}>
<cftry>
<CF_CU_cookieding action="setCookies" branch="#branch#" ret="qGetCookies"> --->
<cfcatch>
<cfset lresponse = {success=false}>
</cfcatch>
</cftry>
<cfreturn lresponse>
</cffunction>
</cfcomponent>
自定义标签CF_CU_cookieding.cfm:
<cfsetting enablecfoutputonly="yes">
<cfparam name="attributes.action" default="">
<cfparam name="attributes.branch" default="">
<cfparam name="attributes.ret" default="">
<cfif attributes.action eq "setCookies">
<cfsavecontent variable="thecontent">
<cfoutput><img src="https://www.domain1.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
<cfoutput><img src="https://www.domain2.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
<cfoutput><img src="https://www.domain3.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
<cfoutput><img src="https://www.domain4.com/scripts/ajax/save/setCookie.cfm<cfif attributes.branch neq "">?branch=#attributes.branch#</cfif>" width="1" height="1"></cfoutput>
</cfsavecontent>
<cfif attributes.ret neq "">
<cfset setvariable("caller.#attributes.ret#", thecontent)>
<cfelse>
<cfoutput>#thecontent#</cfoutput>
</cfif>
<cfelseif attributes.action eq "createCookie">
<cfcookie name="d_cookie_ok" value="1" expires="never">
<cfif attributes.branch neq "">
<cfcookie name="d_cookie_branch" value="#attributes.branch#" expires="never">
</cfif>
</cfif>
和 img scr setCookie.cfm :
<cfparam name="request.branch" default="">
<cfif request.branch neq "">
<CF_CU_cookieding action="createCookie" branch="#request.branch#">
<cfelse>
<CF_CU_cookieding action="createCookie">
</cfif>
您不能在不同的域中设置 cookie,如果您具有 DNS 访问权限,则可以通过使用子域设置来解决这个问题。
example.com 这个.example.com
已使用自定义标签的返回值 qGetCookies 修复cu_cookieding。在我的 cfc 中,我将返回类型更改为 "any"。 我从不必要的文本中删除了 qGetCookies,只有 img 的路径,逗号分隔。发回响应。 在 html 模板的 javascript 中,我为未来的 img 添加了一个 div。我根据 cfc 响应创建了一个数组。 遍历数组以创建图像。现在为多个域设置了 cookie
cfc :
<cfcomponent>
<cffunction name="setCookie" returntype="any" access="remote">
<cfargument name="branch" type="string" required="true">
<cftry>
<CF_CU_cookieding action="setCookies" branch="#branch#" ret="qGetCookies">
<cfcatch>
<cfset lresponse = {success=false}>
</cfcatch>
</cftry>
<cfset lresponse = replace(qGetCookies,'><','>,<','all')>
<cfset lresponse = replace(lresponse, '<img src="','','all')>
<cfset lresponse = replace(lresponse,'" width="1" height="1">','','all')>
<cfreturn lresponse>
</cffunction>
</cfcomponent>
html 模板:
{{#location}}
<li data-markerid="{{markerid}}">
<div class="list-label"><img src="{{marker}}" /></div>
<div class="list-details">
<div class="list-content">
<div class="loc-name">{{name}}</div>
<div class="loc-addr">{{address}}</div>
{{#if address2}}
<div class="loc-addr2">{{address2}}</div>
{{/if}}
<div class="loc-addr3">{{postal}} {{city}}</div>
{{#if web}}
<div class="loc-web"><a href="http://{{web}}" target="_blank">{{niceURL web}}</a></div>
{{/if}}
{{#if distance}}
<div class="loc-dist loc-default-dist">{{distance}} {{length}}</div>
{{#if altdistance}}<div class="loc-dist loc-alt-dist">{{altdistance}} {{altlength}}</div>
{{/if}}
{{/if}}
<div class="loc-directions"><a href="https://maps.google.com/maps?saddr={{origin}}&daddr={{address}} {{address2}} {{city}}, {{state}} {{postal}}" target="_blank">Route</a></div>
<div id="cImgHolder"></div>
<button type="button" class="btn btn-sm" id="voorkeur" onClick="setCookie('{{branch}}','{{name}}')">Als voorkeur instellen</button>
<script>
function setCookie(branch, name) {
$.ajax({
url: "decokay2015/siteparts/branch/setCookieMultipleDomains.cfc"
, type: "POST"
, dataType: "json"
, data: {"method" : "setCookie", "returnFormat": "json", "branch": branch}
}).done(function(response) {
console.log("response", response);
var cArr = response.split(',');
console.log("cArr", cArr);
for (var i = 0; i < cArr.length; i++) {
var elem = document.createElement("img");
elem.setAttribute("src", cArr[i]);
elem.setAttribute("height", "1");
elem.setAttribute("width", "1");
document.getElementById("cImgHolder").appendChild(elem);
}
alert('Uw voorkeur voor ' + name + ' is opgeslagen.');
}).fail(function(jqXHR, textStatus, errorMessage) {
console.log("errorMessage",errorMessage);
});
}
</script>
</div>
</div>
</li>
{{/location}}