We Keep Coding

How to give fake GPU info to site

I need to create web browser using CefSharp.Wpf with ability to give fake data to site for example CPU cores, browser plugins, platform name etc.
There are site that can retrieve all this info: https://www.deviceinfo.me/
My quesiton is: How to hide GPU info from this site? Using javascript or CefSharp functionality
I have tried to redefine WebGLRenderingContext.getParameter method, which gives an info about GPU renderer and vendor:
var canvas = document.createElement('canvas');
var gl;
try {
gl = canvas.getContext("webgl2") || canvas.getContext("webgl") || canvas.getContext("experimental-webgl2") || canvas.getContext("experimental-webgl");
} catch (e) {
}
var oldParam = WebGLRenderingContext.prototype.getParameter;
WebGLRenderingContext.prototype.getParameter = function(parameter){
console.log("we have guests");
if(parameter == debugInfo.UNMASKED_RENDERER_WEBGL){
return "GTX 1080";
}
if(parameter == gl.getExtension("WEBGL_debug_renderer_info").UNMASKED_RENDERER_WEBGL){
return "GTX 1080";
}
if(parameter == debugInfo.UNMASKED_RENDERER_WEBGL){
return "NVidia";
}
if(parameter == gl.VERSION){
return "GTX 1080";
}
return oldParam(parameter);
};
I expected to completely redefine this method and return some fake info, but when i called gl.getParameter(param) again, it still gave me an old gpu info

If you still want Canvas2D and WebGL to still work then you can't hide since they can finger print by actually rendering.
You could disable them with
HTMLCanvasElement.prototype.getContext = function() {
return null;
};
Though the fact they don't exist is also a data point.
Otherwise your wrapper appears to have some issues.
First you really should set the function before creating the context.
Second your last line should be
oldParam.call(this, parameter);
Also you didn't show debugInfo but you can use WebGLRenderingContext instead or you can just hard code the numbers
As for http://www.deviceinfo.me you need to make sure your patch runs in all iframes and workers before any other JavaScript.
WebGLRenderingContext.prototype.getParameter = function(origFn) {
const paramMap = {};
paramMap[0x9245] = "Foo"; // UNMASKED_VENDOR_WEBGL
paramMap[0x9246] = "Bar"; // UNMASKED_RENDERER_WEBGL
paramMap[0x1F00] = "Nobody"; // VENDOR
paramMap[0x1F01] = "Jim"; // RENDERER
paramMap[0x1F02] = "Version 1.0"; // VERSION
return function(parameter) {
return paramMap[parameter] || origFn.call(this, parameter);
};
}(WebGLRenderingContext.prototype.getParameter);
// --- test
const gl = document.createElement('canvas').getContext('webgl');
const ext = gl.getExtension('WEBGL_debug_renderer_info');
show(gl, gl, [
'VENDOR',
'RENDERER',
'VERSION',
]);
if (ext) {
show(gl, ext, [
'UNMASKED_VENDOR_WEBGL',
'UNMASKED_RENDERER_WEBGL',
]);
}
function show(gl, base, params) {
for (const param of params) {
console.log(param, ':', gl.getParameter(base[param]));
}
}

There is WebGLRenderingContext and WebGL2RenderingContext

ViewerJS str.replace how to make it work

I was taking a look at ViewerJS and seems like a good fit the only problem i found was title came out with %20 instead of space. I know why, but I cannot figure out how to fix it.
so it looks like this code gets worked first. how would i fix it in here to make it display with no %20.
function getPDFFileNameFromURL(url) {
var reURI = /^(?:([^:]+:)?\/\/[^\/]+)?([^?#]*)(\?[^#]*)?(#.*)?$/;
// SCHEME HOST 1.PATH 2.QUERY 3.REF
// Pattern to get last matching NAME.pdf
var reFilename = /[^\/?#=]+\.pdf\b(?!.*\.pdf\b)/i;
var splitURI = reURI.exec(url);
var suggestedFilename = reFilename.exec(splitURI[1]) ||
reFilename.exec(splitURI[2]) ||
reFilename.exec(splitURI[3]);
if (suggestedFilename) {
suggestedFilename = suggestedFilename[0];
if (suggestedFilename.indexOf('%') !== -1) {
// URL-encoded %2Fpath%2Fto%2Ffile.pdf should be file.pdf
try {
suggestedFilename =
reFilename.exec(decodeURIComponent(suggestedFilename))[0];
} catch(e) { // Possible (extremely rare) errors:
// URIError "Malformed URI", e.g. for "%AA.pdf"
// TypeError "null has no properties", e.g. for "%2F.pdf"
}
}
}
return suggestedFilename || 'document.pdf';
}

var x = 'Some%20string%20with%20spaces';
x = x.replace(/%20/g, ' ');
console.log(x);

Angular 2 window global object is undefined

For reference: https://github.com/MarkPieszak/aspnetcore-angular2-universal/blob/master/Client/app/platform-modules/app.browser.module.ts#L51
Universal cache object is getting added globoally with initial state like this in the html that's sent to client:
<script>
window.UNIVERSAL_CACHE = { } // stuff gets loaded here
</script>
In my browser.module.ts I'm trying to load that initial state:
// imports
export const UNIVERSAL_KEY = 'UNIVERSAL_CACHE';
#ngModule({
// bootstrap, imports, providers, etc.
})
export class AppBrowserModule {
constructor(public cache: CacheService) {
this.doRehydrate();
}
// Universal Cache "hook"
doRehydrate() {
let defaultValue = {};
let serverCache = this._getCacheValue(CacheService.KEY, defaultValue);
this.cache.rehydrate(serverCache);
}
// Universal Cache "hook
_getCacheValue(key: string, defaultValue: any): any {
// Get cache that came from the server
const win: any = window;
/* I can console.log(win) to see the window object with .UNIVERSAL_CACHE, however if I console.log(win[UNIVERSAL_KEY]) it is undefined. */
if (win[UNIVERSAL_KEY] && win[UNIVERSAL_KEY][key]) {
let serverCache = defaultValue;
try {
serverCache = JSON.parse(win[UNIVERSAL_KEY][key]);
if (typeof serverCache !== typeof defaultValue) {
console.log('Angular Universal: The type of data from the server is different from the default value type');
serverCache = defaultValue;
}
} catch (e) {
console.log('Angular Universal: There was a problem parsing the server data during rehydrate');
serverCache = defaultValue;
}
return serverCache;
} else {
console.log('Angular Universal: UNIVERSAL_CACHE is missing');
}
return defaultValue;
}
}
Unfortunately, win[UNIVERSAL_KEY] is always undefined even though I can console.log(win) and see it, or in the dev tools I can type console.log(window.UNIVERSAL_CACHE) and see it. Any idea why that may be happening?

(I don't have enough reputation to just comment)
The problem come from this function which seems unfinished : https://github.com/angular/universal/blob/master/modules/platform-node/node-platform.ts#L418
When I want to make the message disappear in production, I remove manually the injectCacheInDocument function from my generate js file.

Filter nesting failed in Jade

I have some filters:
var jade = require('jade');
jade.filters.Posts = function(block) {
return '{block:Posts}'+jade.render(block)+'{/block:Posts}';
};
jade.filters.Audio = function(block) {
return '{block:Audio}'+jade.render(block)+'{/block:Audio}';
};
jade.filters.Video = function(block) {
return '{block:Video}'+jade.render(block)+'{/block:Video}';
};
And have some input
:Posts
Posts
:Audio
| Audio
:Video
| Video
So I have an error:
>> unknown filter ":Audio"
Can I handle or fix this problem?
PS You can look at the code in this repository — I'm using grunt and grunt-contrib-jade plugin, but to force grunt-contrib-jade work with filters you should edit ./node_modules/grunt-contrib-jade/tasks/jade.js to reflect changes from this pull request.
PS2: I found the stumbling block. When I use render() method inside filter, I invoke it from local jade instance, which is don't know anything about filters, but global jade instance (from Gruntfile.js) have all information about that filters. That's why the main question is: how can I throw global Jade-instance to file with filters?
PS3: I don't know how create fiddle for such case. But you can clone my Hampi repo, implement changes to grunt-contrib-jade from my PR to them, then at start run npm i. To compile templates run grunt jade. Pay attention to these line in body.jade and commented section in filters.
PS4. I find the reason and it in different scope. I describe it with details here. Can you solve this issue?
I'm open to additional answers and I will accept fixes in jade core (if it would be required).

We just should bind global jade instance to filters like this:
var jade = require('jade');
if (options.filters) {
// have custom filters
Object.keys(options.filters).forEach(function(filter) {
if (_.isFunction(data)) {
// have custom options
jade.filters[filter] = options.filters[filter].bind({jade: jade, locals: data()});
} else {
// have no custom options
jade.filters[filter] = options.filters[filter].bind({jade: jade });
}
});
}
See implementation here — in this commit

I think you are right at problem place, the problem is in the filter.js file
location jade/lib/filters.js
var transformers = require('transformers');
module.exports = filter;
function filter(name, str, options) {
if (typeof filter[name] === 'function') {
var res = filter[name](str, options);
} else if (transformers[name]) {
var res = transformers[name].renderSync(str, options);
if (transformers[name].outputFormat === 'js') {
res = '<script type="text/javascript">\n' + res + '</script>';
} else if (transformers[name].outputFormat === 'css') {
res = '<style type="text/css">' + res + '</style>';
} else if (transformers[name].outputFormat === 'xml') {
res = res.replace(/'/g, ''');
}
} else {
throw new Error('unknown filter ":' + name + '"');
}
return res; // returns RES that is not defined in scope of function.
}
filter.exists = function (name, str, options) {
return typeof filter[name] === 'function' || transformers[name];
};
Here I have identified one flaw that you can correct like this,
var transformers = require('transformers');
module.exports = filter;
function filter(name, str, options) {
var res;//defined a variable which is global to the scope of function.
if (typeof filter[name] === 'function') {
res = filter[name](str, options);
} else if (transformers[name]) {
res = transformers[name].renderSync(str, options);
if (transformers[name].outputFormat === 'js') {
res = '<script type="text/javascript">\n' + res + '</script>';
} else if (transformers[name].outputFormat === 'css') {
res = '<style type="text/css">' + res + '</style>';
} else if (transformers[name].outputFormat === 'xml') {
res = res.replace(/'/g, ''');
}
} else {
throw new Error('unknown filter ":' + name + '"');
}
return res;
}
filter.exists = function (name, str, options) {
return typeof filter[name] === 'function' || transformers[name];
};
It may be possible that nesting under some function makes audio function out of scope. Does audio function works alone!?
although there may be other things if the problem not solved, please create a fiddle for your for better understanding.

Routing knockout.js app with Sammy.js and history with html4 support

I just started playing around with sammy.js and first thing I want to do is to test how history changes works. And it works as expected, even better, but once I open IE10 and switched to IE9 browser mode, everything felled apart. If I'm not setting the links with hash, IE9 just keeps following the links. Same problem with IE8 of course.
At this moment I only have this bit of code related with sammy
App.sm = $.sammy('#content', function() {
this.get('/', function(context) {
console.log('Yo yo yo')
});
this.get('/landing', function(context) {
console.log('landing page')
});
this.get('/:user', function(context) {
console.log(context)
});
});
And initiator
$(function() {
App.sm.run('/');
});
I also looked at this example which contains three types of the links, normal ones, hash and again normal ones, but working properly on IE9 and IE8. that makes me think that somehow it should be possible to make sammy.js support html5 history and html4 at the same time.
So my question would be, how I can do achieve that?
Update
I found the way to make it work on IE
I just added this snippet:
this.bind('run', function(e) {
var ctx = this;
$('body').on('click', 'a', function(e) {
e.preventDefault();
ctx.redirect($(e.target).attr('href'));
return false;
});
});
Anyway, I'm still having a problem with entry to the website, html5 history supporting browsers is always redirected to the domain.com, no matter what was initial url.
So I wonder how I should configure sammy.js to work peroperly. Or maybe anyone could recommend
some other router which would work nicely with knockout.js.

For a number of reasons, including search engine spiders and link sharing; your site should work without the History API. If a user sees http://example.org/poodles/red and wants to show someone else the red poodles on your web site, they copy the link. The other visitor needs to be able to see the same content at the same URL; even if they don't start at the homepage.
For this reason, I suggest using the History API as a progressive enhancement. Where it's available, you should use it to provide a better UX. Where it's not available, links should function as normal.
Here's an example Router (like Sammy) which simply allows the default browser navigation if history.pushState isn't available.
And about the Knockout part; I have used this in a KnockoutJS project and it works well.
(function($){
function Route(path, callback) {
function escapeRegExp(str) {
return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}
// replace "/:something" with a regular expression fragment
var expression = escapeRegExp(path).replace(/\/:(\w+)+/g, "/(\\w+)*");
this.regex = new RegExp(expression);
this.callback = callback;
}
Route.prototype.test = function (path) {
this.regex.lastIndex = 0;
var match = this.regex.exec(path);
if (match !== null && match[0].length === path.length) {
// call it, passing any matching groups
this.callback.apply(this, match.slice(1));
return false;
}
};
function Router(paths) {
var self = this;
self.routes = [];
$.each(paths, function (path, callback) {
self.routes.push(new Route(path, callback));
});
self.listen();
self.doCallbacks(location.pathname);
}
Router.prototype.listen = function () {
var self = this, $document = $(document);
// watch for clicks on links
// does AJAX when ctrl is not down
// nor the href ends in .html
// nor the href is blank
// nor the href is /
$document.ready(function(e){
$document.on("click", "[href]", function(e){
var href = this.getAttribute("href");
if ( !e.ctrlKey && (href.indexOf(".html") !== href.length - 5) && (href.indexOf(".zip") !== href.length - 4) && href.length > 0 && href !== "/") {
e.preventDefault();
self.navigate(href);
}
});
});
window.addEventListener("popstate", function(e) {
self.doCallbacks(location.pathname);
});
};
Router.prototype.navigate = function(url) {
if (window.history && window.history.pushState) {
history.pushState(null, null, url);
this.doCallbacks(location.pathname);
}
};
Router.prototype.doCallbacks = function(url) {
var routes = this.routes;
for (var i=0; i<routes.length; i++){
var route = routes[i];
// it returns false when there's a match
if (route.test(url) === false) {
console.log("nav matched " + route.regex);
return;
}
}
if (typeof this.fourOhFour === "function") {
this.fourOhFour(url);
} else {
console.log("404 at ", url);
}
};
window.Router = Router;
}).call(this, jQuery);
Example usage:
router = new Router({
"/": function () {
},
"/category/:which": function (category) {
},
"/search/:query": function(query) {
},
"/search/:category/:query": function(category, query) {
},
"/:foo/:bar": function(foo, bar) {
}
});
router.fourOhFour = function(requestURL){
};